<template>
    <div>
        <Row>
            <img src="../../assets/mjxt/mjxt.jpg" width="100%">
        </Row>
        <Row>
            <Col offset="4" span="16">
                <div class="af_box1">
                    <div style="text-align: center">
                        <img src="../../assets/fdbj/wk031.jpg" width="100%">
                    </div>
                    <ul>
                        <li>
                            <span>
                            <a href="#"><img src="../../assets/fdbj/wk041.jpg" width="206" height="207" alt=""></a>
                            </span>
                        </li>
                        <li>
                            <span>
                            <a href="#"><img src="../../assets/fdbj/wk061.jpg" width="206" height="207" alt=""></a>
                            </span>
                        </li>
                        <li>
                            <span>
                            <a href="#"><img src="../../assets/fdbj/wk071.jpg" width="206" height="207" alt=""></a>
                            </span>
                        </li>
                        <li style="background:none;">
                            <span>
                            <a href="#"><img src="../../assets/fdbj/wk081.jpg" width="206" height="207" alt=""></a>
                            </span>
                        </li>
                    </ul>
                </div>
            </Col>
        </Row>
        <Row>
            <Col offset="4" span="16">
                <Row style="margin-top: 20px" class="yw">
                    <Col align="center">
                        <h1 style="font-size: 40px;color: #000;line-height: 1.6;font-weight: bold;">门禁、通道系统、智能一卡通</h1>
                        <h3 style="font-size: 18px;color: #316fa6;line-height: 1.6;">一流技术、丰富经验、优质服务、全新理念、售后保障</h3>
                    </Col>
                    <Col span="8" align="center">
                        <h1 class="t">门禁管理系统</h1>
                        <img src="../../assets/mjxt/mj1.png">
                        <p class="p">指纹开门、刷卡开门、电梯控制、<br>密码开门、门禁考勤一体机</p>
                    </Col>
                    <Col span="8" align="center">
                        <h1 class="t">通道管理系统</h1>
                        <img src="../../assets/mjxt/mj2.png">
                        <p class="p">摆闸、翼闸、智能挡闸、转闸、三棍闸</p>
                    </Col>
                    <Col span="8" align="center">
                        <h1 class="t">智能管理系统</h1>
                        <img src="../../assets/mjxt/mj3.png">
                        <p class="p">访客一体机、车位引导系统、消费系统</p>
                    </Col>
                </Row>
            </Col>
        </Row>
        <div style="margin-top:30px;">
            <img src="../../assets/mjxt/body.png" width="100%">
        </div>
    </div>
</template>

<script>
    export default {
        name: 'Mjxt',
        data() {
            return {}
        }
    }
</script>

<style scoped>
    ul, ol, li {
        list-style: none;
    }

    .af_box1 li {
        padding: 0 45px;
        float: left;
        border-right: 1px solid #dfdfdf;
    }

    .af_box1 li a {
        color: #1f48ae;
        font-size: 18px;
    }

    .af_box_2 li {
        margin: 10px 2.5%;
        float: left;
    }

    .af_box_2 li a {
        color: #000;
        font-size: 18px;
    }

    .af_box_2 li a:hover {
        color: #e28666;
    }

    .yw .t{
        font-size: 28px;color: #000;line-height: 1.6;font-weight: bold;
    }
    .yw .p{
        font-size: 14px;
    }

</style>